<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>JSON Formatter 设置</title>
    <link rel="stylesheet" href="popup.css">
</head>

<body>
    <div class="container">
        <h1>JSON Formatter</h1>

        <div class="settings">
            <label>
                <input type="checkbox" id="auto-format">
                自动格式化JSON响应
            </label>

            <div class="theme-select">
                <label>主题:</label>
                <select id="theme">
                    <option value="dark">深色主题</option>
                    <option value="light">浅色主题</option>
                    <option value="solarized">Solarized</option>
                </select>
            </div>

            <button id="reset">重置为默认设置</button>
        </div>

        <div class="instructions">
            <h2>使用说明</h2>
            <ol>
                <li>当访问返回JSON的URL时，插件会自动格式化内容</li>
                <li>使用<span class="key">+</span>/<span class="key">−</span>按钮展开或折叠JSON节点</li>
                <li>使用顶部工具栏按钮控制全部节点</li>
                <li>右键点击JSON可以复制值或路径</li>
            </ol>
        </div>
    </div>

    <script src="popup.js"></script>
</body>

</html>